<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 
		 transform:
		 translate（移动）：值可以使用百分号，是自身的高度和宽度来对比的
		 skew（倾斜）：
		 scale（放大缩小）：大于1效果为缩小，不跟单位；写两个值，xy缩放几倍，只写一个值表示第二个参数和第一个相同
		 rotate（旋转）：单位deg，正值为顺时针，负值为逆时针；
		 设置旋转中心点，transform-origin：x y,默认是50% 50%，还可以给xy设置方位名词，top。。。
		 
		 综合写法：transform：translate（） rotate（） scale（）
		 顺序会影响转换效果；当我们同时有位移和其它属性时，记得位移（translate）一定要移放在最前面
		 
		 transition：all 1s；all用来表示所有变化的属性
		 
		 注意：
		 对行内元素无效
		 不会影响到其它元素的位置
		 
		 
		 让盒子水平垂直居中：
		 以前：
		 position：absolute
		 top：50%
		 left：50%
		 margin-left:width/2
		 margin-top:height/2
		 
		 现在：
		 position：absolute
		 top：50%
		 left：50%
		 transform：translate（-50%， -50%）
		 
		 
		 -->
		 <div id="box1">
		 	 <div id="box2">	
		 	 </div>
		 </div>
		 
	</body>
</html>
